﻿@charset "utf-8";
.banner {background:#000;margin:0 auto;position:relative;width:100%;overflow:hidden;}
.banner .bd {position:relative;}
.banner .bd li img {width:100%;vertical-align:top;}
.banner .bd .banner-txt {width:1160px;bottom:-160px;z-index:1;margin:0 calc(50% - 580px) 150px;position:absolute;background:#193c64;padding:40px 50px;text-align:center;}
.banner .bd .banner-txt h3{text-align:center;color:white;font-weight:300;font-size:36px;}

/*common*/
.art-tlt{width:100%;height:104px;position:relative;}
.art-h1{padding-top:10px;font:normal 900 32px/40px yahei, sana-serif;color:#000;letter-spacing:3px;text-align:center;}
.art-en-h2{font:normal 600 14px/20px yahei, sana-serif;color:#ccc;}
.art-tlt-inner{width:400px;height:78px;margin:0 calc(45% - 140px);position:absolute;top:18px;text-align:center;}
.art-tlt-inner:before{content:"";width:40px;height:18px;border-top: #193c64 solid 4px;border-left: #193c64 solid 4px;border-right: #193c64 solid 4px;top:-18px;left:175px;position: absolute;}
.art-tlt-inner:after{content:"";width:48px;height:2px;border-bottom: #193c64 solid 4px;bottom:-0px;left:175px;position: absolute;}
.pd80{padding:80px 0;}
.pt80 {padding:80px 0 0 0;}
.pd40 {padding:40px 0;}
.mb40 {margin:0 0 40px 0;}
.about:after,.catalog-box:after,.hot-pro:after,.news-list:after {clear:both;content:"";display:block;height:0;visibility:hidden;}
.about:before,.catalog-box:before,.hot-pro:before {content:" ";display:table;}
/*about*/
.about {position:relative;width:100%;height:auto;overflow:hidden;}
.about .inner {width:100%;background:#ee0200;}
.about .inner .article{width:50%;padding:50px calc(50% - 550px) 0 50px;z-index:1;float:right;font:normal 300 13px/20px microsoft yahei,sans-serif;background:#193c64;}
.about .inner .article h1{font:800 32px/64px micrsoft yahei,sans-serif;color:rgba(255,255,255,1)}
.about .inner .article p{margin:10px 0;color:rgba(255,255,255,0.8);}
.about .ab-img{float:left;width:50%;}
.about .ab-img img{width:100%;vertical-align:left;}
.aboutmore {text-align:left;margin:20px 0 0 0;}
.aboutmore .button {margin: 10px 20px 10px 0;font-size:16px;font-weight:300;color:#fff;background:#193c64;border:1px rgba(255,255,255,0.6) solid;}
.aboutmore .button:hover{border:1px rgba(255,255,255,1) solid;background:rgba(255,255,255,0.4);}
 
/*catalog*/
.catalog {width:100%;overflow:hidden;color:white;padding: 80px 0;background:rgba(204,204,204,0.2)}
.catalog .inner{width:1200px;margin:40px auto;}
.catalog-list {width:100%;background:#193c64;}
.catalog-list li{float:left;width:33.333%;text-align:center;}
.catalog-list li a{color:#fff;font:800 20px/36px micrsoft yahei,sans-serif;border-left:solid #fff 1px ;-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;}
.catalog-list li a:hover,.catalog-list li.on a{color:#193c64;background:#fff;}	


.pro-list li{width:calc(25% - 2px);margin:10px 1px;float:left;position:relative;overflow:hidden;}
.pro-list li figure{margin:0;}

.pro-list li img{width:100%;height:auto;-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out;}
.pro-list li figcaption{font:800 16px/48px micrsoft yahei,sans-serif;text-align:center;background:#fff;z-index:999;}
.pro-list li figcaption a{color:#000;}
.pro-list li figcaption a:hover,.pro-list li:hover figcaption a{color:#ee0200;}
.pro-list .images{width:100%;height:100%;overflow:Hidden;}
.pro-list li:hover .images img{-webkit-transform: scale(1.08);
    -moz-transform: scale(1.08);
    -o-transform: scale(1.08);
    transform: scale(1.08);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;}


 @media screen and (min-width:1920px) { .catalog-bg img{width:100%;height:auto;}}
@media screen and (max-width:1024px) {
 
}
@media only screen and (max-width:768px) {
	.banner .bd .banner-txt {display:none;}
 .banner .bd li img {width:auto;vertical-align:top;}
 .art-tlt-inner{width:400px;height:78px;margin:0 calc(50% - 200px);position:absolute;top:18px;text-align:center;}

 .catalog .inner{width:100%;}
 .catalog-list {width:96%;margin:30px 2%;}
 .catalog-list li{float:left;width:49%;margin:0 0.5%;text-align:center;}
 .pro-list li{width:100%;margin:10px 0px;}
 .about .inner .article,.about .ab-img{float:left;width:100%;}
 .about .inner .article { padding: 15px 20px;}
 .about .inner .article h1{font:800 20px/24px micrsoft yahei,sans-serif;color:rgba(255,255,255,1)}
 .about .inner .article p{margin:5px 0;color:rgba(255,255,255,0.8);}
 .aboutmore {text-align:left;margin:10px 0 0 0;}
 .aboutmore .button {margin: 5px 20px 5px 0;font-size:14px;min-height: 28px;line-height: 28px;}

	}
	
.hot-pro{background:#fff}
.hot-pro ul{padding:10px 0;}
.hot-pro li{width:calc(33.3333% - 2px);height:auto;margin:25px 1px  25px 1px;float:left; text-align:center;}
.hot-pro li img{width:100%;height:auto;margin:0;}
.hot-pro li h3{font:normal 600 24px/60px microsoft yahei,sans-serif; text-align:center;padding:0 0 5px 0;margin:0 0 10px 0;}
.hot-pro li h3 a{color:#333;}
.hot-pro li h3 a:hover{color:#ee0200;}
.hot-pro li p{font:normal 300 14px/24px microsoft yahei,sans-serif;color:#777;padding:0 15px;height:70px;overflow:Hidden;}
@media only screen and (max-width:768px) {

}
 
 @media only screen and (max-width:768px) {}

.certificate{padding:80px 0 0 0;}
.certificate-box {width:100%;margin:30px auto 0;background:#f8f8f8 url(../images/catalog-bg.jpg) no-repeat top center /100% 480px;padding:160px 0 80px;}
.certificate-box .art-tlt-inner .art-h1{color:#fff;}
.silde{width:100%;margin:0 auto;} 
.silde li {width:calc(20% - 4px);height:auto;margin:0px 2px;float:left;font:normal 300 15px/20px microsoft yahei,sans-serif;overflow:hidden;position:relative;}
.silde li img{width:100%;height:auto;position:relative;}
 
.album {background:#f1f1f1;padding:80px 0 0px 0;}
.album-box {margin:25px auto 0;width:100%;}
.album-box li {width:calc(20% - 1px);margin:1px 1px 0 0;float:left;position:relative;overflow:hidden;}
.album-box li .cover {text-align:center;position:absolute;top:0px;padding:60px 40px;width:100%;height:100%;background:rgba(238,2,0,1);opacity:0;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;transition:all 0.5s;}
.album-box li:hover .cover {opacity:0.6;}
.album-box li .cover .album-con-h4{font:900 16px/48px micrsoft yahei,sans-serif;letter-spacing:2px;}
.album-box li img {width:100%;height:auto;}
.album-box li:nth-child(even) img {-webkit-filter:grayscale(70%);filter:grayscale(70%);}
.album-box li:nth-child(odd) img {-webkit-filter:grayscale(100%);filter:grayscale(100%);}
.album-box li:hover:nth-child(even) img {-webkit-filter:grayscale(0%);filter:grayscale(0%);}
.album-box li:hover:nth-child(odd) img {-webkit-filter:grayscale(20%);filter:grayscale(20%);}
@media screen and (max-width:1024px) {
}
@media only screen and (max-width:768px) {
	.silde li {width:100%;height:auto;margin:0px;}

	.album-box li {width:calc(50% - 1px);margin:1px 1px 0 0;float:left;position:relative;overflow:hidden;}
	}
	
.news {background: #fff;padding:80px 0;}
 
.news-box {width:1120px;margin:30px auto;}
.news-list li {width:calc(33% - 100px);height:auto;margin:0 50px;padding:10px 15px 20px 15px;overflow:hidden;float:left;border: 1px rgba(204,204,204,0.1) solid;position: relative;
    background: url(../images/shadow.jpg) no-repeat center bottom;}
 
.news-list .images img{width:100%;height:auto;overflow:hidden;-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out;}
.news-list li .con {width:100%;height:auto;}

.news-list .images{width:100%;height:100%;overflow:Hidden;}
.news-list li:hover .images img{-webkit-transform: scale(1.08);
    -moz-transform: scale(1.08);
    -o-transform: scale(1.08);
    transform: scale(1.08);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;}
.news-list li .con h4 {height:40px;font:normal 600 16px/40px yahei,sans-serif;overflow:hidden;}
.news-list li .con h4 a {color:#333;}
.news-list li:hover .con h4 a {color:#ee0200;}
.news-list li .con .date{font:normal 600 14px/20px yahei,sans-serif;color:#ccc;background: url(../images/icon/logo-case.png) no-repeat left center /15px 15px;-webkit-filter: grayscale(100%);filter: grayscale(100%);padding:0 15px 0 25px;}
.news-list li .con p:before{content:"";width:48px;height:2px;border-top: rgba(238,2,0,0.6) solid 3px;top:2px;left:0px;position: absolute;}
.news-list li .con p {height:70px;line-height:20px;overflow:hidden;font-size:12px;padding-top:10px;margin:5px 0 20px 0;position:relative;}
 
 
@media only screen and (max-width:1920px) {}
@media only screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {
}
@media only screen and (max-width:768px) {
	.news-box {width:100%;margin:30px auto;}
	.news-list li {width:calc(90% - 10px);height:auto;margin:0 5px;padding:10px 15px 20px 15px;overflow:hidden;float:left;border: 1px rgba(204,204,204,0.1) solid;position: relative;
    background: url(none) no-repeat center bottom;}
 
	}
 
	
	.more {text-align:center;margin:40px auto 0;}
.more .button {font-size:20px;font-weight:300;color:rgba(255,255,255,1);background:#193c64;}
